import React from 'react';
import { Input } from 'antd';
import './index.css';
import { Link } from 'react-router-dom';

const { Search } = Input;

const Header = () => {
  const logout = () => {
    localStorage.clear();
  };

  return (
    <header className="header">
      <div className="left">
        <a href="/">
          <img src={require('../../assets/images/cnodejs_light.svg')} alt="" />
        </a>
        <Search
          className="search"
          onSearch={(value) => {
            window.location.href = `https://www.google.com.hk/search?hl=zh-CN&q=site:cnodejs.org+${value}&cad=h`;
          }}
        />
      </div>
      <div className="right">
        <ul>
          <li>
            <a href="/">首页</a>
          </li>
          <li>
            <Link to="/collect">收藏夹</Link>
          </li>
          <li>
            <a href="/" onClick={logout}>
              退出
            </a>
          </li>
        </ul>
      </div>
    </header>
  );
};

export default Header;
